import React, {Component} from 'react';
import { connect } from 'umi';
import {Spin} from 'antd';
import UserInfoCard from '../../components/home/person/UserInfoCard';
import UserBasicCard from '../../components/home/person/UserBasicCard';
import config from "../../config/config";
import styles from './Home.less';

class PersonPage extends React.Component {

  constructor(props) {
    super(props);
  }

  render() {

    const { dispatch, personModel } = this.props;

    const {
      loading, tokenModel, userInfoVo, menuData, roleInfoData, onSaveUserInfo, onCloseUserInfo, cacheUserData,
      userRelateVo
    } = personModel;

    const userInformationProps = {
      userInfoVo
    }

    const userAuthorizationProps = {
      tokenModel,
      menuData,
      roleInfoData,
      onSaveUserInfo,
      onCloseUserInfo,
      userInfoVo,
      cacheUserData,
      userRelateVo,
      onTabChange: (key) => {
        if ("organize" == key) {
          dispatch({ type: "personModel/getCorrelateByUser", payload: {} });
        } else if ("limit" == key) {
          dispatch({ type: "personModel/getAuthorizeByUser", payload: {} });
        }
      }
    }

    return (
      <div className={styles.home_layout_div} style={{ height: 'calc(100% - 30px)' }}>
        <Spin spinning={loading} size={"large"} tip={"数据加载中。。。。。。"}>
          <div id={"userInfoPage"} className={styles.person_info_auth}>
            {/* 个人资料 */}
            <UserInfoCard {...userInformationProps} />

            {/* 基本信息 */}
            <UserBasicCard {...userAuthorizationProps} />
          </div>

          {/* Footer脚标 */}
          <div className={styles.home_footer_Div}>
            <div className={styles.footFontDiv}>{config.FOOTER_TEXT}</div>
          </div>
        </Spin>
      </div>
    );
  }
}

function mapStateToProps({ globalModel, personModel }) {
  return { globalModel, personModel };
}

export default connect(mapStateToProps)(PersonPage);
